import chart from '@/utils/chart.js'
import {toYYYYMMDD,  toHHMM,  toMMDD,  formatTimeStamp} from '@/utils/timeUtil'
import { parseNumFloat} from '@/utils/tool'
import { keyToZh, valToZh} from './codeMaps.js'
import { ONE_DAY_MS} from './consts.js'
import { format } from 'silly-datetime'
export const chartTempFridge = (chartData, time_start, time_end, isOneDay, showModeTip, deviceDetail) => {
  let series = []
  const key = 'tem'
  const isArea = true
  let style = chart.styleConfig('#70C3EF', 'solid', isArea)
  let o = {
    data: [],
    name: keyToZh(key),
    ...chart.ECHART_LINE_CONFIG_BIG_DATA,
    ...style
  }
  series.push(o)
  for (let data of chartData) {
    o.data.push([data.upload, data.data[key]])
  }
  // if (chartData.length === 0) {
  //     for (let i = 0; i <= 24; i++) {
  //       if (i === 24) {
  //         o.data.push([new Date(`${toYYYYMMDD(time_start)} 23:59:59`).getTime(), 0])
  //       } else {
  //         o.data.push([new Date(`${toYYYYMMDD(time_start)} ${i}:00`).getTime(), 0])
  //       }
  //     }
  // } else {

  // }

  let xInterval = Math.ceil((time_end - time_start) / (24 * 3600 * 1000))
  let xAxisConfig = null
  // 选择 一天 的x轴config
  if (isOneDay) {
    xAxisConfig = {
      splitLine: {
        show: false
      },
      type: 'time',
      maxInterval: 1 * 3600 * 1000,
      min: function (value) {
        let todayStart = new Date(
          new Date(value.min).toLocaleDateString()
        ).getTime()
        return todayStart
      },
      max: function (value) {
        let todayStart = new Date(
          new Date(value.min).toLocaleDateString()
        ).getTime()
        let todayEnd = todayStart + ONE_DAY_MS
        return todayEnd
      },
      axisLabel: {
        show: true,
        color: '#c3c6cd',
        rotate: 30,
        formatter: (value, index) => {
          let t = toHHMM(new Date(value).getTime())
          return `${t}`
        }
      }
      // data: xData
    }
  } else {
    // 选择 多天 的x轴config
    xAxisConfig = {
      splitLine: {
        show: false
      },
      type: 'time',
      maxInterval: xInterval * 3600 * 6 * 1000,
      min: function (value) {
        let todayStart = value.min
        return todayStart
      },
      max: function (value) {
        console.log('最大值', format(value.max, 'YYYY-MM-DD HH:mm:ss'))
        let dayEnd = value.max
        return dayEnd
      },
      axisLabel: {
        show: true,
        color: '#c3c6cd',
        rotate: 0,
        formatter: (value, index) => {
          let d = toMMDD(new Date(value).getTime())
          let t = toHHMM(new Date(value).getTime())
          return `${d} ${t}`
        },
        // showMaxLabel: false
      }
      // data: xData
    }
  }

  let option = {
    // legend: {
    //   data: ['设定温度', '房间温度'],
    //   selected: legendSelected,
    //   ...chart.DETAIL_LEGEND
    // },
    grid: {
      top:'45',
      left: '3%',
      right: '4%',
      bottom: '3%',
      containLabel: true
    },
    tooltip: {
      ...chart.TOOLTIP,
      formatter: (params, ticket) => {
        let s = ''
        s = s + formatTimeStamp(params[0].axisValue) + `</br>`

        for (let item of params) {
          let unit = ''
          if (item.seriesName.indexOf('温度') >= 0) {
            unit = '°C'
            s += `<span style="color:${item.color}">
                    <span class="tooltip-m">${item.seriesName}: </span>${item.value[1]}${unit}</span></br>`
          } else if (showModeTip) {
            s += `<span style="color:${item.color}">
                    <span class="tooltip-m">${item.seriesName}: </span>${valToZh(item.value[1])}</span></br>`
          }
        }
        return s
      }
    },
    dataZoom: [{
      type: 'inside',
      throttle: 50
    }],
    xAxis: {
      ...xAxisConfig,
      axisLine: {
        show: true,
        lineStyle: {
          color: '#6E798B'
        }
      },
      axisTick: {
        show: false
      }
    },
    yAxis: {
      name: '°C       ',
      type: 'value',
      ...chart.AXIS_STYLE
    },
    series: series
  }
  return option
}
